<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
        <script src="../js/jquery-1.11.3.min.js"></script>
 		<script src="../js/echarts/esl.js"></script>
        <script src="../js/echarts/echarts.js"></script>
        <link href="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=5FnNQNGWXlHGq9nbLKLLAsdU"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.js"></script>
</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:100%;width:100%;"></div>
<!-- ECharts单文件引入 -->


<script type="text/javascript">
// 路径配置
(function () {
    require.config({
        paths: {
            echarts: '../js/echarts'
        },
        packages: [
            {
                name: 'BMap',
                location: '../js/echarts',
                main: 'main'
            }
        ]
    });

    require(
    [
        'echarts',
        'BMap',
        'echarts/chart/map'
    ],
    function (echarts, BMapExtension) {
        var BMapExt = new BMapExtension($('#main')[0], BMap, echarts,{
            enableMapClick: false
        });
        var map = BMapExt.getMap();
        var container = BMapExt.getEchartsContainer();
        var startPoint = {
            x: 106.575418,
            y: 29.563784
        };
        var point = new BMap.Point(startPoint.x, startPoint.y);
        var  mapStyle ={ 
            styleJson:[
          {
                    "featureType": "administrative",
                    "elementType": "labels",
                    "stylers": {
                              "visibility": "off"
                    }
          },
          {
                    "featureType": "poi",
                    "elementType": "labels",
                    "stylers": {
                              "visibility": "off"
                    }
          },
          {
                    "featureType": "subway",
                    "elementType": "all",
                    "stylers": {
                              "visibility": "off"
                    }
          },
          {
                    "featureType": "highway",
                    "elementType": "labels",
                    "stylers": {
                              "visibility": "off"
                    }
          },
          {
                    "featureType": "arterial",
                    "elementType": "all",
                    "stylers": {
                              "color": "#f3f3f3"
                    }
          },
          {
                    "featureType": "water",
                    "elementType": "geometry",
                    "stylers": {
                              "color": "#e1eefa"
                    }
          },
          {
                    "featureType": "green",
                    "elementType": "geometry",
                    "stylers": {
                              "color": "#e9f6e4"
                    }
          },
          {
                    "featureType": "land",
                    "elementType": "geometry",
                    "stylers": {
                              "color": "#ffffff"
                    }
          },
          {
                    "featureType": "railway",
                    "elementType": "all",
                    "stylers": {
                              "visibility": "off"
                    }
          },
          {
                    "featureType": "highway",
                    "elementType": "all",
                    "stylers": {
                              "color": "#e5e5e5"
                    }
          }
]
        }
        map.setMapStyle(mapStyle);
        map.centerAndZoom(point, 13);
        map.enableScrollWheelZoom(true);
        map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
        // 地图自定义样式
        

        option = {
            color: ['gold','aqua','lime'],
            title : {
                //text: '业务态势',
                //subtext:'2016年6月7日 16:36:37',
                x:'center',
                y:50,
                textStyle : {
                    color: '#cc3300'
                }
            },
            tooltip : {
                trigger: 'item',
                formatter: function (v) {
                    return v[1].replace(':', ' > ');
                }
            },
            legend: {
                orient: 'vertical',
                x:'20',
                y:'20',
                data:['质监局', '公安局', '卫生局'],
                selectedMode: 'single',
                selected:{
/*                    '公安局' : false,
                    '卫生局' : false*/
                },
                textStyle : {
                    color: '#cc3300'
                }
            },
            toolbox: {
                show : false,
                orient : 'vertical',
                x: 'right',
                y: 'center',
                feature : {
                    mark : {show: true},
                    dataView : {show: true, readOnly: false},
                    restore : {show: true},
                    saveAsImage : {show: true}
                }
            },
            dataRange: {
                min : 0,
                max : 100,
                x: 'right',
                calculable : true,
                color: ['#ff3333', 'orange', 'yellow','lime','aqua'],
                textStyle:{
                    color:'#fff'
                }
            },
            series : [
                {
                    name:'质监局',
                    type:'map',
                    mapType: 'none',
                    data:[],
                    geoCoord: {
                        '质监局': [106.57286,29.582113],
                        '公安局': [106.543884,29.602368],
                        '民政局': [106.538522,29.60944],
                        '工商局': [106.504515,29.602531],
                        '环保局': [106.498951,29.597481],
                        '卫生局': [106.511869,29.599488],
                        '财政局': [106.511846,29.611997],


                        '渝中区交警分局': [106.584681,29.564279],
                        '渝北区交警分局': [106.530568,29.617557],
                        '渝中区交通事故处理办公室': [106.528809,29.541978],
                        '市公安局': [106.542786,29.604009],
                        '市公安局渝北分局': [106.636975,29.714022],
                        '市公安局南岸区分局': [106.655033,29.510042],
                        '市公安局巴南区分局': [106.544854,29.408037],


                        '长安汽车': [106.756934,29.639529],
                        '江淮汽车': [106.558287,29.524131],
                        '吉利汽车': [106.580391,29.501672],
                        '五菱汽车': [106.567218,29.589329],
                        '陆风汽车': [106.492993,29.511084],
                        '宝骏汽车': [106.566527,29.590289],
                        '奇瑞汽车': [106.56972,29.480599],
                        '力帆汽车': [106.4619,29.52693],
                        '长城汽车': [106.508161,29.528672],
                        '华晨汽车': [106.503245,29.577708],
                        '起亚汽车': [106.347353,29.635318],
                        '比亚迪汽车': [106.347379,29.635583],             
                        '众泰汽车': [106.515554,29.530287],


                        '重庆医科大学附属第一医院': [106.519743,29.535798],
                        '第三军医大学大坪医院': [106.528977,29.548006],
                        '重庆市第五人民医院': [106.606213,29.575471],
                        '重庆市第二人民医院': [105.897147,29.363664],
                        '重庆市第一人民医院': [106.590345,29.564712],
                        '武警重庆总队医院': [106.593836,29.588371]
                    },

/*                    markLine : {
                        smooth:true,
                        effect : {
                            show: true,
                            scaleSize: 1,
                            period: 30,
                            color: '#fff',
                            shadowBlur: 10
                        },
                        itemStyle : {
                            normal: {
                                borderWidth:3,
                                lineStyle: {
                                    type: 'solid',
                                    shadowBlur: 10
                                },
                               label: {
                                   show: true, 
                                   formatter: function (params,ticket,callback) {//格式化展现（标签+值）
                                    console.log(params.name + params.value);
                                    var arrname = params.name.split(":");
                                    return arrname[1] + "\n "+ params.value;
                                   }  
                                }
                            }
                        },
                        data : [
                            [{name:'质监局'}, {name:'江淮汽车',value:96}],
                            [{name:'质监局'}, {name:'吉利汽车',value:75}],
                            [{name:'质监局'}, {name:'五菱汽车',value:67}],
                            [{name:'质监局'}, {name:'陆风汽车',value:80}],
                            [{name:'质监局'}, {name:'宝骏汽车',value:70}],
                            [{name:'质监局'}, {name:'力帆汽车',value:43}],
                            [{name:'质监局'}, {name:'奇瑞汽车',value:80}],
                            [{name:'质监局'}, {name:'华晨汽车',value:70}], 
                            [{name:'质监局'}, {name:'起亚汽车',value:30}],
                            [{name:'质监局'}, {name:'长城汽车',value:37}],
                            [{name:'质监局'}, {name:'长安汽车',value:21}]
                       ]
                    },*/
                    markPoint : {
                        symbol:'emptyCircle',
                        symbolSize : function (v){
                            return 10 + v/10
                        },
                        effect : {
                            show: true,
                            shadowBlur : 0
                        },

                        itemStyle : {
                           normal:{
                               label: {
                                   show: true
                                }
                            }
                        },

                        data : [
                            {name:'江淮汽车',value:96},
                            {name:'吉利汽车',value:75},
                            {name:'五菱汽车',value:67},
                            {name:'陆风汽车',value:80},
                            {name:'宝骏汽车',value:70},
                            {name:'力帆汽车',value:43},
                            {name:'奇瑞汽车',value:80},
                            {name:'华晨汽车',value:70}, 
                            {name:'起亚汽车',value:30},
                            {name:'长城汽车',value:37},
                            {name:'长安汽车',value:21}
                        ]
                    }

                },
                {
                    name:'公安局',
                    type:'map',
                    mapType: 'none',
                    data:[],
/*                    markLine : {
                        smooth:true,
                        effect : {
                            show: true,
                            scaleSize: 1,
                            period: 30,
                            color: '#fff',
                            shadowBlur: 10
                        },
                        itemStyle : {
                            normal: {
                                borderWidth:3,
                                lineStyle: {
                                    type: 'solid',
                                    shadowBlur: 10
                                },
                               label: {
                                   show: true, 
                                   formatter: function (params,ticket,callback) {//格式化展现（标签+值）
                                    console.log(params.name + params.value);
                                    var arrname = params.name.split(":");
                                    return arrname[1] + "\n"+ params.value;
                                   }  
                                }
                            }
                        },
                        data : [
                            [{name:'公安局'}, {name:'江淮汽车',value:96}],
                            [{name:'公安局'}, {name:'吉利汽车',value:75}],
                            [{name:'公安局'}, {name:'五菱汽车',value:67}],
                            [{name:'公安局'}, {name:'陆风汽车',value:80}],
                            [{name:'公安局'}, {name:'宝骏汽车',value:70}],
                            [{name:'公安局'}, {name:'力帆汽车',value:43}],
                            [{name:'公安局'}, {name:'奇瑞汽车',value:80}],
                            [{name:'公安局'}, {name:'华晨汽车',value:70}], 
                            [{name:'公安局'}, {name:'起亚汽车',value:90}],
                            [{name:'公安局'}, {name:'长城汽车',value:37}],
                            [{name:'公安局'}, {name:'长安汽车',value:71}]
                        ]
                    },*/
                    markPoint : {
                        symbol:'star',
                        symbolSize : function (v){
                            return 10 + v/10
                        },
                        effect : {
                            show: true,
                            shadowBlur : 0
                        },
                        itemStyle:{
                            normal:{
                                label:{show:false}
                            }
                        },
                        data : [
                           {name:'渝中区交警分局',value:96},
                           {name:'渝北区交警分局',value:75},
                           {name:'渝中区交通事故处理办公室',value:67},
                           {name:'市公安局',value:80},
                           {name:'市公安局渝北分局',value:70},
                           {name:'市公安局南岸区分局',value:43},
                           {name:'市公安局巴南区分局',value:71}
                        ]
                    }
                },
                {
                    name:'卫生局',
                    type:'map',
                    mapType: 'none',
                    data:[],
/*                    markLine : {
                        smooth:true,
                        effect : {
                            show: true,
                            scaleSize: 1,
                            period: 30,
                            color: '#fff',
                            shadowBlur: 10
                        },
                        itemStyle : {
                            normal: {
                                borderWidth:2,
                                lineStyle: {
                                    type: 'solid',
                                    shadowBlur: 10
                                },
                               label: {
                                   show: true, 
                                   formatter: function (params,ticket,callback) {//格式化展现（标签+值）
                                    console.log(params.name + params.value);
                                    var arrname = params.name.split(":");
                                    return arrname[1] + "\n"+ params.value;
                                   }  
                                }
                            }
                        },
                        data : [
                            [{name:'卫生局'}, {name:'宝骏汽车',value:96}],
                            [{name:'卫生局'}, {name:'力帆汽车',value:75}],
                            [{name:'卫生局'}, {name:'众泰汽车',value:67}],
                            [{name:'卫生局'}, {name:'华晨汽车',value:70}], 
                            [{name:'卫生局'}, {name:'比亚迪汽车',value:21}]
                        ]
                    },*/
                    markPoint : {
                        symbol:'heart',
                        symbolSize : function (v){
                            return 10 + v/10
                        },
                        effect : {
                            show: true,
                            shadowBlur : 0
                        },
                        itemStyle:{
                            normal:{
                                label:{show:false}
                            }
                        },
                        data : [
                            {name:'重庆医科大学附属第一医院',value:96},
                            {name:'第三军医大学大坪医院',value:75},
                            {name:'重庆市第五人民医院',value:35},
                            {name:'重庆市第二人民医院',value:96},
                            {name:'重庆市第一人民医院',value:75},
                            {name:'武警重庆总队医院',value:21}

                        ]
                    }
                }                

            ]
        };

        var myChart = BMapExt.initECharts(container);
        BMapExt.setOption(option);
    }
);
})();

</script>
</body>
</html>

